import React, { useState } from 'react';
import { Form, Input, Select, Switch, Button, message } from 'antd';
import { AdminType, ProblemPermission, CreateUserRequest } from '@/types/user';
import userService from '@/services/userService';
import { FormCard } from '@/components/common';

const { Option } = Select;

interface UserFormProps {
  onSuccess: () => void;
}

const UserForm: React.FC<UserFormProps> = ({ onSuccess }) => {
  const [form] = Form.useForm();
  const [loading, setLoading] = useState(false);

  // 提交表单
  const handleSubmit = async (values: CreateUserRequest) => {
    setLoading(true);
    try {
      await userService.createUser(values);
      form.resetFields();
      onSuccess();
    } catch (error) {
      console.error('Failed to create user:', error);
    } finally {
      setLoading(false);
    }
  };

  return (
    <FormCard
      title="创建用户"
      form={form}
      onFinish={handleSubmit}
      formProps={{
        initialValues: {
          admin_type: 'Regular User',
          problem_permission: 'None',
          is_disabled: false,
        }
      }}
      actions={[
        <Button key="reset" onClick={() => form.resetFields()}>重置</Button>,
        <Button key="submit" type="primary" htmlType="submit" loading={loading}>
          创建用户
        </Button>
      ]}
    >
      <Form.Item
        name="username"
        label="用户名"
        rules={[
          { required: true, message: '请输入用户名' },
          { min: 3, message: '用户名至少3个字符' },
          { max: 30, message: '用户名最多30个字符' },
        ]}
      >
        <Input placeholder="请输入用户名" />
      </Form.Item>

      <Form.Item
        name="email"
        label="电子邮箱"
        rules={[
          { required: true, message: '请输入电子邮箱' },
          { type: 'email', message: '请输入有效的电子邮箱' },
        ]}
      >
        <Input placeholder="请输入电子邮箱" />
      </Form.Item>

      <Form.Item
        name="password"
        label="密码"
        rules={[
          { required: true, message: '请输入密码' },
          { min: 6, message: '密码长度不能少于6个字符' }
        ]}
      >
        <Input.Password placeholder="请输入密码" />
      </Form.Item>

      <Form.Item
        name="password_confirm"
        label="确认密码"
        dependencies={['password']}
        rules={[
          { required: true, message: '请确认密码' },
          ({ getFieldValue }) => ({
            validator(_, value) {
              if (!value || getFieldValue('password') === value) {
                return Promise.resolve();
              }
              return Promise.reject(new Error('两次输入的密码不一致'));
            },
          }),
        ]}
      >
        <Input.Password placeholder="请再次输入密码" />
      </Form.Item>

      <Form.Item
        name="admin_type"
        label="用户类型"
        rules={[{ required: true, message: '请选择用户类型' }]}
      >
        <Select placeholder="请选择用户类型">
          <Option value="Regular User">普通用户</Option>
          <Option value="Admin">管理员</Option>
          <Option value="Super Admin">超级管理员</Option>
        </Select>
      </Form.Item>

      <Form.Item
        name="problem_permission"
        label="题目权限"
        rules={[{ required: true, message: '请选择题目权限' }]}
      >
        <Select placeholder="请选择题目权限">
          <Option value="None">无权限</Option>
          <Option value="Own">仅自己的题目</Option>
          <Option value="All">所有题目</Option>
        </Select>
      </Form.Item>

      <Form.Item
        name="is_disabled"
        label="禁用用户"
        valuePropName="checked"
      >
        <Switch />
      </Form.Item>
    </FormCard>
  );
};

export default UserForm; 